<!DOCTYPE HTML>
<html>
<head>
<title>Robot Web Tools</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link href="http://fonts.googleapis.com/css?family=Open+Sans:400,300,700,800" rel="stylesheet"
  type="text/css" />
<script src="js/jquery-1.8.3.min.js"></script>
<script src="css/5grid/init.js?use=mobile,desktop,1000px&amp;mobileUI=1&amp;mobileUI.theme=none">
  
</script>
<script src="js/jquery.dropotron-1.2.js"></script>
<script src="js/init.js"></script>
<noscript>
  <link rel="stylesheet" href="css/5grid/core.css" />
  <link rel="stylesheet" href="css/5grid/core-desktop.css" />
  <link rel="stylesheet" href="css/5grid/core-1200px.css" />
  <link rel="stylesheet" href="css/5grid/core-noscript.css" />
  <link rel="stylesheet" href="css/style.css" />
  <link rel="stylesheet" href="css/style-desktop.css" />
</noscript>
<script>
  (function(i, s, o, g, r, a, m) {
    i['GoogleAnalyticsObject'] = r;
    i[r] = i[r] || function() {
      (i[r].q = i[r].q || []).push(arguments)
    }, i[r].l = 1 * new Date();
    a = s.createElement(o), m = s.getElementsByTagName(o)[0];
    a.async = 1;
    a.src = g;
    m.parentNode.insertBefore(a, m)
  })(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');

  ga('create', 'UA-39765480-1', 'robotwebtools.org');
  ga('send', 'pageview');
</script>
<!--[if lte IE 9]><link rel="stylesheet" href="css/ie9.css" /><![endif]-->
<!--[if lte IE 8]><link rel="stylesheet" href="css/ie8.css" /><![endif]-->
<!--[if lte IE 7]><link rel="stylesheet" href="css/ie7.css" /><![endif]-->
</head>
<body class="homepage">

  <a href="https://github.com/RobotWebTools"><img
    style="position: absolute; top: 0; right: 0; border: 0;"
    src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png"
    alt="Fork us on GitHub"> </a>

  <!-- Header Wrapper -->
  <div id="header-wrapper">
    <div class="5grid-layout">
      <div class="row">
        <div class="12u">

          <!-- Header -->
          <header id="header">
            <div class="inner">

              <!-- Logo -->
              <h1>
                <a href="#" class="mobileUI-site-name">RobotWebTools</a>
              </h1>

              <!-- Nav -->
              <nav id="nav" class="mobileUI-site-nav">
                <ul>
                  <li class="current_page_item"><a href="index.html">Home</a></li>
                  <li><a href="tools.html" class="arrow">Tools</a>
                    <ul>
                      <li><a href="tools.html#libraries">Libraries</a></li>
                      <li><a href="tools.html#widgets">Widgets</a></li>
                      <li><a href="tools.html#systems">Systems</a></li>
                      <li><a href="tools.html#server-side">Server-Side</a></li>
                    </ul>
                  </li>
                  <li><a href="demos.html" class="arrow">Demos</a></li>
                  <li><a href="community.html">Community</a></li>
                </ul>
              </nav>

            </div>
          </header>

          <!-- Banner -->
          <div id="banner">
            <h2>
              <strong>Robot Web Tools</strong> is a collection of open-source modules and tools for
              building web-based robot apps.
            </h2>
            <p>Want to see Robot Web Tools in action?</p>
            <a href="demos.html" class="button button-big button-icon button-icon-check">View
              Demos</a>
          </div>

        </div>
      </div>
    </div>
  </div>

  <!-- Main Wrapper -->
  <div id="main-wrapper">
    <div class="main-wrapper-style1">
      <div class="inner">

        <!-- Feature 1 -->
        <section class="5grid-layout box-feature1">
          <div class="row">
            <div class="12u">
              <header class="first major">
                <h2>Bringing Robots to your Favorite Browser</h2>
                <span class="byline">Robot Web Tools allows web applications to interface
                  with a variety of robots running middleware like the popular <strong>Robot
                    Operating System (ROS)</strong> using the latest in <strong>HTML5</strong> 
                    and <strong>JavaScript</strong>.</span>
              </header>
            </div>
          </div>
          <div class="row">
            <div class="4u">
              <section>
                <span class="image image-full"><a href="demos/urdf.html"><img
                            src="images/demos/ros3djs-fetch-urdf.jpg" /> </a> </span>
                <header class="second second-friends">
                  <h3>3D Interactions</h3>
                  <span class="byline">Using the latest in WebGL</span>
                </header>
              </section>
            </div>
            <div class="4u">
              <section>
                <span class="image image-full"><img src="images/pic02.jpg" /> </span>
                <header class="second second-gear">
                  <h3>Multi-Platform Support</h3>
                  <span class="byline">Harnessing the power of ROS</span>
                </header>
              </section>
            </div>
            <div class="4u">
              <section>
                <span class="image image-full"><img src="images/pic03.jpg" /> </span>
                <header class="second second-chart">
                  <h3>Towards Compatibility</h3>
                  <span class="byline">More browsers, more robots.</span>
                </header>
              </section>
            </div>
          </div>
        </section>
      </div>
    </div>
    <div class="main-wrapper-style2">
      <div class="inner">

        <!-- Feature 2 -->
        <section class="5grid-layout box-feature2">
          <div class="row">
            <div class="6u">
              <section class="pad-right">
                <header class="major">
                  <h2>Robot Web Architecture</h2>
                  <span class="byline">Bridging Robots and the Web</span>
                </header>
                <p>
                  A variety of routes are available for architecting a robot web application. A
                  common route is building web technologies on an existing robot framework. The <a
                    href="http://www.ros.org/wiki/">Robot Operating System (ROS)</a> is one of the
                  more popular robot middlewares to build upon.
                </p>
                <p>
                  ROS is one of the top frameworks to program robots and can run on a variety of
                  robots, from a <a href="http://turtlebot.com/">TurtleBot</a> to a <a
                    href="http://www.willowgarage.com/pages/pr2/overview">PR2</a> to an <a
                    href="http://www.arduino.cc/">Arduino</a> connected to a computer. ROS - and
                  other robot middleware frameworks - provide common robot functionality, including
                  drivers for interfacing with a variety of sensors and actuators and algorithms for
                  navigation, perception, and manipulation.
                </p>
                <footer>
                  <a href="http://www.ros.org/wiki/"
                    class="button button-medium button-icon button-icon-rarrow">Find out more</a>
                </footer>
              </section>
            </div>
            <div class="6u">
              <section class="pad-left">
                <header class="major">
                  <h2>rosbridge as a Transport</h2>
                  <span class="byline">Using JSON to Speak to your Robot</span>
                </header>
                <p>
                  While ROS works great for applications on the robot, another layer is needed to
                  connect external devices and applications. 
                  rosbridge is both a JSON spec for interacting with ROS and a transport layer,
                  providing a WebSocket for clients to communicate over.
                </p>
                <p>
                  In the browser layer sits the core JavaScript libraries: 
                  <a href="https://github.com/RobotWebTools/roslibjs">roslibjs</a>,
                  <a href="https://github.com/RobotWebTools/ros2djs">ros2js</a>, and
                  <a href="https://github.com/RobotWebTools/ros3djs">ros3djs</a>. These libraries 
                  communicate with ROS on the robot over rosbridge's WebSocket server. It's a lightweight,
                  evented library that provides a convenient abstraction to core ROS functionality.
                </p>
                <p>
                  The real benefits of the Robot Web Tools organization is JavaScript modules and
                  tools that build off these foundations. Check out the <a href="tools.html">Tools</a>
                  section for a list of what the community has contributed. And please <a
                    href="https://github.com/RobotWebTools/robotwebtools.github.com/">add your
                    own</a>!
                </p>
              </section>
            </div>
          </div>
        </section>

      </div>
    </div>
    <div class="main-wrapper-style3">
      <div class="inner">
        <div class="5grid-layout">
          <div class="row">
            <div class="12u">
              <header class="first major">
                <h2 class="icon icon-paper">Cite Us!</h2>
                <span class="byline">Using Robot Web Tools in your research or project? We'd appreciate
		    a citation to the <a href="pdf/paper.pdf">following paper</a>:</span>

		    <p>Russell Toris, Julius Kammerl, David Lu, Jihoon Lee, Odest Chadwicke Jenkins, 
		    Sarah Osentoski, Mitchell Wills, and Sonia Chernova. 
		    <strong>Robot Web Tools: Efficient Messaging for Cloud Robotics</strong>.  In 
		    <em>Proceedings of the IEEE/RSJ International Conference on Intelligent Robots 
                    and Systems</em> (IROS), 2015</p>
              </header>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <!-- Footer Wrapper -->
  <div id="footer-wrapper">
    <footer id="footer" class="5grid-layout">
      <div class="row">
        <div class="6u">
          <section>
            <h2>
              Check us out on <strong>GitHub</strong>!
            </h2>
            <p>Robot Web Tools hosts all of its code on GitHub. We encourage contributions and
              feedback on all of our projects.</p>
            <a href="http://github.com/robotwebtools"
              class="button button-alt button-icon button-icon-rarrow">More @
              github.com/robotwebtools</a>
          </section>

        </div>
      </div>
      <br />
      <div class="row">
        <div class="3u">
          <!-- Links -->
          <section>
            <h2>Resources</h2>
            <ul class="style2">
              <li><a href="https://github.com/RobotWebTools/roslibjs">roslibjs @ github</a></li>
              <li><a href="https://github.com/RobotWebTools/ros2djs">ros2djs @ github</a></li>
              <li><a href="https://github.com/RobotWebTools/ros3djs">ros3djs @ github</a></li>
            </ul>
          </section>
        </div>
        <div class="3u">
          <!-- Links -->
          <section>
            <h2>Sponsors</h2>
            <ul class="style2">
              <li><a href="http://fetchrobotics.com/">Fetch Robotics</a></li>
              <li><a href="http://www.rail.gatech.edu/">Georgia Tech</a></li>
              <li><a href="http://www.eecs.umich.edu/cse/">University of Michigan</a></li>
            </ul>
          </section>
        </div>
        <div class="6u">
          <!-- About -->
          <section>
            <h2>Contact</h2>
            <div class="5grid">
              <div class="row">
                <dl class="contact">
                  <dt>GitHub</dt>
                  <dd>
                    <a href="http://github.com/robotwebtools">github.com/robotwebtools</a>
                  </dd>
                  <dt>WWW</dt>
                  <dd>
                    <a href="http://robotwebtools.org">robotwebtools.org</a>
                  </dd>
                  <dt>Email</dt>
                  <dd>
                    <a href="mailto:robot-web-tools@googlegroups.com">
                      robot-web-tools@googlegroups.com</a>
                  </dd>
                </dl>
              </div>
            </div>    
          </section>
        </div>
      </div>
      <div class="row">
        <div class="12u">
          <div id="copyright">
            RobotWebTools.org is licensed under a <a
              href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Creative Commons
              Attribution 3.0 Unported License</a>.
          </div>
        </div>
      </div>
    </footer>
  </div>

</body>
</html>
